<template>
  <div>
    <vueueditorwrap
      v-model="ueditor.value"
      :config="ueditor.config"
    ></vueueditorwrap>
  </div>
</template>
<script>
import vueueditorwrap from 'vue-ueditor-wrap'
export default {
  components: { vueueditorwrap },
  data() {
    return {
      ueditor: {
        value: `<p>这个是通过vue-ueditor-wrap组件使用富文本, 比自己集成容易一点</p><p>
    <a href="https://www.cnblogs.com/zr123/p/11101429.html" target="_self">https://www.cnblogs.com/zr123/p/11101429.html</a><br><a href="https://www.cnblogs.com/ouyangxiaoyao/p/12722059.html" target="_self">https://www.cnblogs.com/ouyangxiaoyao/p/12722059.html</a>
</p>`, // 编辑器默认内容
        config: { // 设置编辑器宽高
          initialFrameWidth: null,
          initialFrameHeight: 350,
          UEDITOR_HOME_URL: '/static/ueditor/', // 为编辑器实例添加一个路径
          serverUrl: 'http://127.0.0.1:8000/upload' // 服务器统一请求接口路径
        }
      }
    }
  },
  methods: {
    getContent() {
      console.log(this.$refs.ued.getUEContent())
    }
  }
}
</script>

<style >
.CodeMirror-wrap {
  text-align: left;
}
</style>
